<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
    {% include "/include/headinclude.html" %}
</head>
<body style="padding-top: 70px; ">
   {% include "/include/headnav.html" %}
   <!--主框架开始 -->
   <div class="container">
       <!--行式布局 -->
      <div class="row">
             <!--左边栏开始 -->
        <div class="col-xs-4 col-md-3 bg-info">
            {% include "/include/leftnav.html" %}
        </div>
             <!--左边栏结束 -->
          <!--主界面开始 -->
        <div class="col-xs-8 col-md-9">
            <h1 class="page-header">系统整体信息</h1>
            <div class="row">
                <div class="col-md-12">
                    <form class="form-inline" action="/getserverstatus" method="get">
                        <div class="form-group">
                        <label class="sr-only" for="hostselect">主机信息</label>
                        <div class="input-group">
                             <select class="form-control" name="hostselect" id="hostselect">
                                  {% for item in hostlist %}
                                      <option name="{{ item.ip }}" value="{{item.ip}}"
                                              {% if item.ip == hostip %}
                                                 selected
                                              {% endif %}
                                              >{{item.ip}}</option>
                                  {% endfor %}
                             </select>
                        </div>
                      </div>
                      <button type="submit" class="btn btn-primary" id="getHostInfo">打开</button>
                      <button type="button" class="btn btn-primary" id="refreshView">刷新图表</button>

                    </form>
                </div>
            </div>
            <p class="bg-warning"></p>
            <div class="row">
                <!-- 系统整体信息左边栏 -->
               <div class="col-md-4">
                   <div class="panel panel-primary">
                       <div class="panel-heading"><span class="glyphicon glyphicon-home" aria-hidden="true"></span>基本状态信息</div>
                          <div class="panel-body">
                              <p>主机名：{{ hostInfo.hostname }}</p>
                              <p>操作系统：{{ hostInfo.OS }}</p>
                              <p>内存大小：{{ hostInfo.MEM_SIZE }}</p>
                              <p>CPU大小：{{ hostInfo.CPU_SIZE }}</p>
                              <p>磁盘大小：{{ hostInfo.DB_SIZE }}</p>
                              <p>网卡数据：{{ hostInfo.hostname }}</p>
                              <p>其它说明信息：{{ hostInfo.hostname }}</p>
                          </div>
                   </div>
               </div>
                <!-- 系统整体信息左边栏 -->
                <!-- 系统整体信息右边栏 -->
               <div class="col-md-8">
                    <div class="panel-group" id="accordion">
                           <div class="panel panel-info">
                                  <!-- Default panel contents -->
                                  <div class="panel-heading">
                                          <span class="glyphicon glyphicon-signal" aria-hidden="true"></span>
                                        基本状态信息
                                  </div>
                                  <div class="panel-body">
                                      <div class="row">
                                            <div class="col-xs-12">
                                                  <div class="chart_div" id="service_chart" style="height:200px;"></div>
                                            </div>
                                            <div class="col-xs-12">
                                                  <div class="chart_div" id="machine_chart" style="height:200px;"></div>
                                            </div>
                                      </div>

                                  </div>
                           </div>
                    </div>

               </div>
                <!-- 系统整体信息右边栏 -->
            </div>
            <!--整体浏览界面 -->
            <!--整体浏览界面 -->

        </div>
          <!--主内容布局结束 -->
      </div>
       <!--行式布局结束 -->
   </div>

    <!-- Modal -->
   <!--主框架结束 -->
{% include "/include/buttom.html" %}
<script type="text/javascript" src="/static/res/js/serverstatus.js"></script>
</body>
</html>